import React from 'react'
interface Props {
    datas: Array<string>
}
interface State {
    show: boolean;
    select:string;
}
class Arrowlist extends React.Component<Props, State>{
    static defaultProps: Props = {
        datas: ["1", "2", "3"]
    } as any;
    constructor(props: any) {
        super(props)
        this.state = { show: false, select: "" }
    }
    render() {
        return (
            <div className="infor">
                <div className={`item ${this.state.show ? "active" : ""}`} onClick={() => this.setState({ show: !this.state.show })} >{this.state.show ? "隐藏" : "显示"}</div>
                {this.props.children}
                {this.state.show?<div className="list">
                    {this.props.datas.map((item) => {
                        return <span key={item} className={+this.state.select === +item ? "active" : ""} onClick={() => {
                            this.setState({ select: item,show:!this.state.show});
                        }}>{item}</span>
                    })}
                </div>:null}
            </div>
        )
    }
}
export default Arrowlist